import React from "react"
import Header from "../components/Header"
import { graphql } from "gatsby"
export default function List({data}) {
    console.log(data)
    
    return <>
        <h1>List</h1>
        <Header></Header>
        {
            data.allMarkdownRemark.nodes.map(item=>(
                <div key={item.id}>
                    <p>{item.frontmatter.title}</p>
                    <p>{item.frontmatter.date}</p>
                    <div dangerouslySetInnerHTML={{__html:item.html}}></div>
                </div>
            ))
        }
    </>
}

export const query = graphql`
    query {
        allMarkdownRemark {
            nodes {
                frontmatter {
                title
                date
                }
                html
                id
            }
        }
  }
`